<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>学生主页-活动广场</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Access-Control-Allow-Origin" content="*">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="../lib/layui-v2.6.3/css/layui.css" media="all">
    <script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/jquery-3.1.1.min.js"></script>
</head>
<style>
    /* #main_body>div {
        margin-left: 40px;
    }

    #main_body {
        width: 800px;
        margin-top: 50px;
        margin: 20px auto;
        border-radius: 20px;
        box-shadow: 3px 3px 5px 2px rgb(187, 187, 187);
    } */

    #title {
        margin: 20px 40px;
        font-size: 30px;
        letter-spacing: 1px;
        padding-top: 20px;
    }

    .tag {
        text-align: center;
        line-height: 30px;
        vertical-align: top;
        display: inline-block;
        border-radius: 8px;
        font-size: 13px;
    }

    #end_time {
        margin-left: 30px;
        background-color: #ffeac9;
        height: 30px;
        width: 160px;
        color: #ff9500;
    }

    #type {
        background-color: #ffeac9;
        height: 30px;
        width: 60px;
        color: #ff9500;
    }

    #mark {
        text-align: center;
        background-color: rgb(202, 202, 202);
        height: 30px;
        width: 150px;
    }

    .main_title {
        font-weight: 800;
        text-align: center;
        font-size: 18px;
    }

    #require {
        margin: 20px auto;
        width: 600px;
        line-height: 30px;
    }

    #time {
        margin: 20px auto;
        width: 200px;
        line-height: 30px;
        text-align: center;
    }

    #rule {
        margin: 20px auto;
        width: 600px;
        line-height: 30px;
        text-align: center;
    }

    #bottom {
        text-align: center;
        height: 60px;
        position: relative;
        width: 720px;
        line-height: 38px;
    }

    #bottom button {
        position: absolute;
        width: 150px;
        border-radius: 7px;
    }

    .material {
        left: 70px;
        background-color: #FB9101;
    }

    .submit {
        right: 70px;
        background-color: #FB9101;
    }

    .nosubmit {
        right: 70px;
        background-color: rgb(120, 120, 120);
    }

    #bottom text {
        font-weight: 700;
        font-family: 'SimHei';
        color: rgb(120, 120, 120);
    }

    .return {
        background: none;
        border: none;
        cursor: pointer;
        position: absolute;
        left: 20px;
    }

    .return img {
        width: 40px;
    }
</style>

<body>
    <div id="main_body">
    </div>
    <script src="../lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
    <script src="../js/lay-config.js?v=2.0.0" charset="utf-8"></script>
    <script>
        function submit() {
            var base64 = localStorage.getItem('base64');
            blob2 = dataURLtoBlob(base64);
            console.log(blob2);
            const blobUrl = window.URL.createObjectURL(blob2);
            const a = document.createElement('a');
            a.href = blobUrl;
            a.download = 'file.docx';
            a.click();
            window.URL.revokeObjectURL(blobUrl);
            var myDate = new Date();
            var time = myDate.toLocaleDateString();
            var a_no = JSON.parse(localStorage.getItem(localStorage.getItem('current'))).a_no;
            $.get('/file', {
                "upload": 1,
                "download": 0,
                //"base64": base64,
                "a_no": a_no,
                "time": time
            }, function (re) {
                if (re == 0)
                    layer.msg("提交失败");
                else
                    layer.msg("提交成功");
            })
        }

        function blobToDataURL(blob, callback) {
            let a = new FileReader();
            a.onload = function (e) {
                callback(e.target.result);
            }
            a.readAsDataURL(blob);
        }

        function dataURLtoBlob(dataurl) {
            var arr = dataurl.split(','),
                mime = arr[0].match(/:(.*?);/)[1],
                bstr = atob(arr[1]),
                n = bstr.length,
                u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bstr.charCodeAt(n);
            }
            return new Blob([u8arr], {
                type: mime
            });
        }

        function fileChange(e) {
            let evt = e || window.event;
            let file = evt.target.files[0];
            let reader = new FileReader();
            let reader2 = new FileReader();
            let rs = reader.readAsArrayBuffer(file);
            let blob = null;
            let blob2 = null;
            reader.onload = (e) => {
                if (typeof e.target.result === 'object') {
                    blob = new Blob([e.target.result])
                } else {
                    blob = e.target.result
                }
                console.log(blob);
                let byte = null;
                blobToDataURL(blob, function (base64) {
                    localStorage.setItem('base64', base64);
                })
            }
            $('.material').text("更新上传");
            $('#submit').attr('class', 'layui-btn layui-btn-warm submit');
            document.getElementById('submit').disabled = false;
        }
        layui.use(['jquery', 'layer', 'miniAdmin', 'miniTongji'], function () {
            var $ = layui.jquery,
                layer = layui.layer,
                miniAdmin = layui.miniAdmin,
                miniTongji = layui.miniTongji;
            $('.return').on('click', function () {
                history.back(-1);
            })

            $(function () {
                var aname = localStorage.getItem('aname');
                $.get('/showActivity', {
                    status: 3,
                    aname: aname,
                }, function (re) {
                    data = re;
                    console.log(data)
                    var html, bottom;
                    var status = localStorage.getItem('status');
                    html = '<div id="title">' + data.data[0].a_name +
                        '</div><div class="blew_title"><div id="end_time" class="tag"><span>' +
                        data.data[0].e_time + ' 00:00</span>&nbsp;截止</div>\
                    <div id="type" class="tag">' + data.data[0].type +
                        '</div></div><div id="main"><div class="main_title">活动要求</div><div id="require">' +
                        data.data[0].rule + '</div>\
                    <div class="main_title">活动时间</div><div id="time"><p>开始时间:<span id="start">' + data.data[0].s_time +
                        '</span></p><p>结束时间:<span id="end">' + data.data[0].e_time + '</span> </p>\
                    </div><div class="main_title">量化规则</div><div id="rule">' + data.data[0].lh_rule + '</div></div>';
                    document.getElementById('main_body').innerHTML = html;
                })
            });
        });
    </script>
</body>